<template>
<div>
    <div>
        <NoteTag @getTags="selectTags = $event" :detailTags = "detailTags" />
    </div>
    <el-affix :offset="71">
        <div id="editor-toolbar" class="shadow"></div>
        <div>
            <el-button @click="saveNote" class="border-0">保存</el-button>
        </div>
    </el-affix>
    <div class="px-5 py-5">
        <div class="shadow-lg">
            <input type="text" v-model="note.noteName" class="note-name px-3 py-3" placeholder="请输入标题..." />
        </div>
        <div>
            <div id="editor-container" class="note-content shadow-lg"></div>
        </div>
    </div>
</div>
  
</template>

<script>
import NoteTag from "./NoteTag.vue";
import Editor from "@/editor/editor.js";
export default {
    name:"NoteEdit",
    components:{
        NoteTag,
    },
    data(){
        return{
            editor:null,
            noteId:this.$router.params.noteId,
            selectTags:[],
            datailTags:[],//用给NoteTag.vue组件初始化选中的标签
            note:{
                noteId:null,
                noteName:null,
                noteIntro:null,
                noteContent:null,
                NoteTags:[],
            },
        };
    },
    async mounted(){
        await this.getDetail();
        this.editor = new Editor();
        this.editor.initAll(this.note.noteContent);
    },
    methods:{
        //读取详情页面
        async getDetail(){
            await this.$axios("/api/note/detail?noteId=" + this.noteId)
            .then((response) => {
                let data = response.data;
                if(data.code == 200){
                    this.note = data.data;
                    this.detailTags = data.data.tags;
                }else{
                    alert(data.msg);
                }
            });
        },
        saveNote(){
            this.note.noteIntro = this.editor.getNoteIntro();
            this.note.noteContent = this.editor.getNoteContent();
            this.note.NoteTags = this.selectTags
            this.$axios.post('/api/space/note/edit',this.note)
            .then(response=>{
                let data = response.data;
                alert(data.msg);
                if(data.code == 200){
                    this.$router.push("/space/notelist");
                }
            });
        },
    },

};
</script>

<style>

</style>